<%--
  Created by IntelliJ IDEA.
  User: Admin
  Date: 2/11 0011
  Time: 11:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Easyui页面布局</title>
    <script type="text/javascript" src="js/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
    <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.3.1/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.3.1/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.3.1/demo/demo.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="js/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
</head>
<body>
<div id="cc" class="easyui-layout" style="width:100%;height:100%;" fit=true>
    <div region="north" title="Easyui-练习" split="true" style="height:100px;"></div>
    <%--<div region="south" title="South Title" split="true" style="height:100px;"></div>--%>
    <%--<div region="east" iconCls="icon-reload" title="East" split="true" style="width:100px;"></div>--%>
    <div region="west" split="true" title="菜单" style="width:100px;">
        <div id="aa" class="easyui-accordion" fit=true>
            <div title="用户管理" style="overflow:auto;padding:10px;">
                <a title="jsp/1.jsp">用户列表</a><br>
                <a title="jsp/1.jsp">用户信息</a>
            </div>
            <div title="岗位管理" selected="true" style="padding:10px;">
                content2
            </div>
            <div title="权限管理">
                content3
            </div>
            <div title="资源管理">
                content3
            </div>
        </div>
    </div>
    <div region="center" title="主界面" style="padding:5px;background:#eee;">
        <div id="tt" class="easyui-tabs" fit=true style="width:500px;height:250px;">

        </div>
    </div>
</div>

</body>
<script type="text/javascript">
    $(function () {
        $("a[title]").click(function () {
            var src = $(this).attr("title");//得到引入的路径
            var title = $(this).html();//得到title的文本值
            if($("#tt").tabs("exists",title)){
                $("#tt").tabs("select",title);
            }else{
                $("#tt").tabs('add', {
                    title: title,//title的文本值
                    content: "<iframe frameborder=0 src="+src+" style=width:100%;height:100% ></iframe>",
                    closable: true//具有关闭的效果
                });
            }
        });
    })
</script>
</html>
